// !!!!   取出本地数据渲染  数据
const addEdit = JSON.parse(localStorage.getItem('info'))
// console.log(addEdit)
const {
    author,
    pic,
    status,
    content,
    tags,
    title,
    cateid
} = addEdit
//  渲染 下拉框
const allCate1 = JSON.parse(localStorage.getItem('allCate'))
$('select[name="interest"]').html(allCate1.map(({
    catename,
    id
}) => `<option value=""></option>` + `<option value="${id}">${catename}</option>`).join(''))
form.render('select')
// 渲染 复选框
const allTag1 = JSON.parse(localStorage.getItem('allTag'))
console.log(allTag1)
$('#checkboxaaa').html(allTag1.map(({
    tagname
}) => `<input type="checkbox" value="${tagname}" name="tags" title="${tagname}">`).join(''))
form.render('checkbox')

// ! 渲染===回显 下拉框和标题  调用本地数据 （借用layui）
layui.use(function () {
    var $ = layui.$;
    var form = layui.form;
    // 表单赋值
    form.val('demo-val-filter', {
        "title": title, // "name": "value"
        "interest": 6,
    })
})

// ! 渲染===回显 复选框  调用本地数据 （字符串转数组 给对应val值 的复选框添加checked）
let checkedadd = $('input[name="tags"]')
let ids = new Array()
for (let i = 0; i < checkedadd.length; i++) {
    ids.push(checkedadd[i].defaultValue)
}
console.log(tags)
const tagsArr = tags.split(',')
console.log(tagsArr)
for (let i = 0; i < ids.length; i++) {
    for (let j = 0; j < tagsArr.length; j++) {
        if (ids[i] == tagsArr[j]) {
            // console.log(tagsArr[j])
            $('input[name="tags"][value="' + tagsArr[j] + '"]').attr('checked', true)
        }
    }
}
// console.log(ids)
// ! 渲染===图片  调用本地数据 （拼接字符串）
if (pic !== null) {
    $('#ID-upload-demo-img').attr('src', `http://124.223.14.236:8060/${pic}`)
}

// ! 渲染===富文本框  调用本地数据 （拼接字符串）
const E = window.wangEditor
const editor = new E("#contentBox")
editor.config.height = 200
editor.create()
editor.txt.html(content)

// ! 渲染===图片  回显 （借用layui）
let imgEdit
layui.use(function () {
    var upload = layui.upload;
    var $ = layui.$;
    // 单图片上传
    var uploadInst = upload.render({
        elem: '#ID-upload-demo-btn',
        url: 'http://124.223.14.236:8060/common/upload?type=images', // 此处用的是第三方的 http 请求演示，实际使用时改成您自己的上传接口即可。
        headers: {
            token: localStorage.getItem("token")
        },
        before: function (obj) {
            // 预读本地文件示例，不支持ie8
            obj.preview(function (index, file, result) {
                $('#ID-upload-demo-img').attr('src', result); // 图片链接（base64）

            });
        },
        done: function ({
            data: {
                savePath
            }
        }) {
            //上传完毕回调
            console.log(savePath)
            imgEdit = savePath
        }
    });
});
// ! 获取按钮 值为 发布还是草稿 取消功能
let state
// 发布按钮
$(".btn-success").click(() => {
    state = '2'
    // console.log(state)
})
// 草稿按钮
$(".btn-primary").click(() => {
    state = '1'
    // console.log(1)
})

$('.btn-warning').click(() => {
    layer.msg(('取消修改,返回用户首页'), {
        icon: 1,
        time: 1000 // 设置 2 秒后自动关闭
    }, function () {
        // 关闭后 跳转操作
        location.href = '../public/user.html'
    })
})

//  !!!  收集数据发送ajax 请求
$('.form-add').submit(async function (e) {
    e.preventDefault()
    console.log(state)
    const data = $(this).serializeArray();
    const title = data[0].value
    const interest = data[1].value
    console.log(data)
    const arr = data.filter(item =>
        item.name === 'tags'
    ).map(item => item.value).join(',')
    // console.log(arr)
    const content = editor.txt.html()
    const dataAdd = {
        author: localStorage.getItem('user'),
        pic: imgEdit,
        status: state,
        content,
        tags: arr,
        title,
        cateid: interest
    }
    // console.log(dataAdd)
    const {
        status
    } = await axios.post('/user/addArticle', dataAdd)
    if (status !== 200) {
        return layer.msg('发布失败 请重新输入')
    }
    // 成功1秒后跳转会用户中心
    layer.msg(('发布成功,跳转文章中心'), {
        icon: 1,
        time: 1000 // 设置 2 秒后自动关闭
    }, function () {
        // 关闭后 跳转操作
        location.href = '../public/user-list.html'
    })
})